import { color } from "../config"
import { curveVector } from "../config/curve"
import * as THREE from "three"
import vertexShader from "../shaders/wall/vertex.glsl"
import fragmentShader from "../shaders/wall/frag.glsl"
export class Wall {
    scene: THREE.Scene
    time: THREE.IUniform
    config: any
    constructor(scene: THREE.Scene, time: THREE.IUniform) {
        this.scene = scene
        this.time = time
        this.config = {
            radiusTop: 50,//; — 圆柱的顶部半径，默认值是1。
            radiusBottom: 50,// — 圆柱的底部半径，默认值是1。
            height: 30,// — 圆柱的高度，默认值是1。
            radialSegments: 32,// — 圆柱侧面周围的分段数，默认为32。
            heightSegments: 1,// — 圆柱侧面沿着其高度的分段数，默认值为1。
            openEnded: true,// — 一个Boolean值，指明该圆锥的底面是开放的还是封顶的。默认值为false，即其底面默认是封顶的。
            thetaStart: 0,// — 第一个分段的起始角度，默认为0。（three o'clock position）
            thetaLength: Math.PI * 2,// — 圆柱底面圆扇区的中心角，通常被称为“θ”（西塔）。默认值是2*Pi，这使其成为一个完整的圆柱。

        }
        this.init()
    }
    init() {
        let {radiusTop,radiusBottom,height,radialSegments,heightSegments,openEnded} = this.config
        const geometry = new THREE.CylinderGeometry(radiusTop, radiusBottom, height, radialSegments, heightSegments, openEnded)
        console.log();

        const material = new THREE.ShaderMaterial({
            vertexShader,
            fragmentShader,
            uniforms: {
                u_color: {
                    value: new THREE.Color(color.wall)
                },
                u_time:this.time,
                u_height:{
                    value:height
                },
                u_opacity:{
                    value:0.5
                }
            },
            transparent: true,
            side: THREE.DoubleSide,
            depthTest:false
        })
        geometry.translate(0,this.config.height / 2,0)
        const mesh = new THREE.Mesh(geometry, material)
        let position=curveVector[1]
        mesh.position.set(position.start.x,position.start.y,position.start.z)
        this.scene.add(mesh)
    }
}